{include file="public/head"/}
<script language="javascript">
	$(document).ready(function () {
        var lang = $('#lang').text();
        var language = '';
        if (lang == 'pt-br') {
            language = 'pt-BR';
            langsql = 'pt';
            format = 'dd/mm/yyyy';
        } else if (lang == 'en-us') {
            language = 'en';
            langsql = 'en';
            format = 'dd/mm/yyyy';
        } else {
            language = 'zh-CN';
            langsql = 'zh';
            format = 'yyyy/mm/dd'
        }
		// datatimepicker 设置
		$('.form_datetime').datetimepicker({
			language: language, // en ,zh-CN, pt-BR
            format:format,
			minView: 'month',
			weekStart: 0, //一周从哪一天开始
			todayBtn:  1, //
			autoclose: 1,
			todayHighlight: 1,
			startView: 2,
			forceParse: 0,
			showMeridian: 1
		});
	});
</script>

<div class="container-fluid" id="main">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="alert alert-dismissable alert-info">
                <button type="button" class="close">×</button>
                <p></p>
            </div>
        </div>
    </div>
   
    <div class="ntDesktop">
    	<div class="ntDesktop-head" ref="type" data-type="{$request}">{$title}</div>
      <input type="hidden" id="plan" value="{if isset($plan_id)}{$plan_id}{/if}">
    
        <div class="row clearfix" style="padding-top:0px">
            <div class="col-md-12 text-right">
                <div>
                    <a href="{:url('buy/plan')}" class="btn btn-default"><span class="glyphicon glyphicon-chevron-left"></span>{:lang('back_to_list')}</a>
                    <a href="javascript:;" class="btn btn-primary" style="padding-left:2em;padding-right:2em;" @click="savefun(true)"> <span class="glyphicon glyphicon-floppy-saved"></span> {:lang("return_to_list_after_saving")} </a>
                    <a href="javascript:;" class="btn btn-primary" style="padding-left:2em;padding-right:2em;" @click="savefun(true)"> <span class="glyphicon glyphicon-floppy-save"></span> {:lang("continue_adding_new_content_after_saving")}</a>
                </div>
            </div>
        </div>
    
        <div class="row" style="padding:1em" v-cloak>
            <div class="col-md-7">
                <table class="table table-striped table-hover ntTable">
                    <tbody>
                        <tr>
                            <td style="vertical-align:middle">{:lang("designated_buyer")}<span class="required"></span></td>
                            <td style="vertical-align:middle">
                                <select class="form-control" v-model="data.buy_id">
                                    <option value="0">{:lang("please_select_buyer")}</option>
                                    <option :value="item.id" v-for="(item,index) in dataval.buy_persion" :key="item.id">{{item.nickname}}</option>
                                </select>
                            </td>
                            <td style="vertical-align:middle">{:lang("delivery_time")}<span class="required"></span></td>
                            <td>
                                <div class="input-group date form_datetime" data-date="" data-date-format="yyyy-mm-dd" data-link-field="workdate">
                                    <input class="form-control" id="dateval" type="text" ref="date">
                                    <span class="input-group-addon"><span class="glyphicon glyphicon-calendar" style="margin:0"></span></span>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>{:lang("delivery_address")}<span class="required"></span></td>
                            <td colspan="3">
                                <select class="form-control" v-model="data.port_id">
                                    <option value="0">{:lang("select_delivery_address")}</option>
                                    <option :value="item.id" v-for="(item,index) in dataval.port" :key="item.id" >{{item.name}}</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td>{:lang("designated_company")}</td>
                            <td colspan="3">
                            	<div class="row">
	                                <div class="col-md-12">
                                        <div class="input-group">
                                            <input type="text" class="form-control col-md-12" ref="company" placeholder="{:lang("enter_the_company_name")}" width="100%">
                                            <div class="input-group-btn">
                                                <button type="button" class="btn btn-default" @click="getcompany">
                                                    <span class="glyphicon glyphicon-search"></span> {:lang('search')}
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </td>
                        </tr>
                        <tr>
                            <td>&nbsp;</td>
                            <td colspan="3">
                                <select class="form-control" v-model="data.company_id">
                                    <option value="0">{:lang("please_select_company")}</option>
                                    <option :value="item.id" v-for="(item,index) in company">{{item.name}}</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td>{:lang('the_role_of_product')}<span class="required"></span></td>
                            <td colspan="3">
                            	<div class="row">
	                                <div class="col-md-12">
                                        <div class="input-group">
                                            <div class="input-group-btn">
                                                <select  class="form-control" name="" ref="procat" id="procat" style="width: 150px;">
                                                    <option value="0" selected >{:lang("please_select_a_product_category")}</option>
                                                    <option :value="item.id" v-for="(item,index) in dataval.procat">
                                                        <template v-for="(level,index) in item.level">
                                                            &nbsp;&nbsp;&nbsp;&nbsp;
                                                        </template>
                                                        {{item.content}}
                                                    </option>
                                                </select>
                                            </div>
                                            <input type="text" class="form-control col-md-12" value="" ref="searchText"  placeholder="{:lang("enter_product_role_ID,_model_and_name")}" width="100%">
                                            <div class="input-group-btn">
                                                <button type="button" class="btn btn-default" @click="sqlpro">
                                                    <span class="glyphicon glyphicon-search " ></span> {:lang('search')}
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </td>
                        </tr>

                        <tr>
                        	<td>&nbsp;</td>
                            <td colspan="3">
                                <select class="form-control" @change="changepro" ref='selpro' v-model="data.proval">
                                    <option value="0">{:lang("please_select_product")}</option>
                                    <option :value="item.id+'-'+item.pro_id" v-for="(item,index) in prolist">{{item.feature}}</option>
                                </select>
                            </td>
                        </tr>
                        <tr>
                            <td>{:lang("purchase_quantity_")}(CTN)<span class="required"></span></td>
                            <td>
                                <input type="number" class="form-control text-right" v-model="data.qty" placeholder="{:lang("purchased_quantity_(box)")}" >
                            </td>
                            <td>{:lang("purchase_prices")}<span class="required"></span></td>
                            <td>
                                <input type="number" class="form-control text-right" v-model="data.price">
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
            <div class="col-md-5">
                <div class="row">
                    <ul class="nav nav-tabs">
                        <li class="active">
                        	<a href="#buy_pro_info" data-toggle="tab">产品资料</a>
                        </li>
                        <li v-for="(item,index) in prodesc_cat">
                        	<a :href="'#buy_pro_'+item.id" data-toggle="tab">{{item.name}}</a>
                        </li>
                        <li>
                        	<a href="#buy_pack" data-toggle="tab">{:lang('box_measure')}</a>
                        </li>
                        <li>
                        	<a href="#buy_item" data-toggle="tab">产品配件</a>
                        </li>
                        <li>
                            <a href="#buy_history" data-toggle="tab">{:lang("purchased_history")}</a>
                        </li>
                    </ul>
                </div>
            	<div class="row tab-content">
                	<div class="tab-pane in active" id="buy_pro_info">
                        <div class="row" v-if="!prodata"><h3 style="text-align: center;">{:lang('no_data')}</h3></div>
                    	<div class="row" v-if="prodata">
                        	<div class="col-md-3 text-center">
                            	<img :src="prodata.img_url" width="128px" height="128px" border="0" >
                            </div>
                            <div class="col-md-9">
                                <table class="table table-striped table-hover ntTable">
                                    <tbody>
                                        <tr>
                                            <td>{:lang("brand")}</td>
                                            <td>{{prodata.brand_name}}</td>
                                        </tr>
                                        <tr>
                                            <td>{:lang("product_name")}</td>
                                            <td>{{prodata.content}}</td>
                                        </tr>
                                        <tr>
                                            <td>{:lang("introduction")}</td>
                                            <td colspan="3">{{prodata.prodesc}}</td>
                                        </tr>
                                        <tr>
                                            <td>{:lang('serial_number')}</td>
                                            <td>{{prochar.id}}</td>
                                        </tr> 
                                        <tr>
                                            <td>{:lang("model")}</td>
                                            <td>{{prochar.model}}</td>
                                        </tr>
                                        <tr v-for="(item,index) in prochar.feature">
                                            <td>{{item.name}}</td>
                                            <td colspan="3">{{item.value}}</td>
                                        </tr>
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                	<div class="tab-pane" :id="'buy_pro_'+item.id"  v-for="(item,index) in prodesc_cat">
                        <table class="table table-striped table-hover ntTable">
                            <tbody>
                                <tr>
                                    <td>
                                        <textarea class="form-control" style="height:25vh" v-model="item.content">
                                        </textarea>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                	<div class="tab-pane" id="buy_pack">
                        <div class="row" v-if="!norm"><h3 style="text-align: center;">{:lang('no_data')}</h3></div>
                        <table v-if="norm" class="table table-striped table-hover ntTable">
                            <tbody>
                                <tr>
                                    <td>{:lang("quantity")}/CTN</td>
                                    <td><input type="number" class="form-control text-right" v-model="norm.qty"></td>
                                    <td>{:lang("weight")}/CTN</td>
                                    <td><input type="number" class="form-control text-right" v-model="norm.ctn_kgs"></td>
                                </tr>
                                <tr>
                                    <td>{:lang("dimension")}/CTN</td>
                                    <td><input type="text" class="form-control text-right" v-model="norm.ctn_size"></td>
                                    <td>{:lang("volume")}/CTN</td>
                                    <td><input type="number" class="form-control text-right" v-model="norm.ctn_m3"></td>
                                </tr>
                                <tr>
                                    <td>{:lang("total_quantity")}</td>
                                    <td class="text-right">{{sumnub}} <span class="unit">PCS</span></td>
                                    <td>{:lang("total_amount")}</td>
                                    <td class="text-right">{{summn}} <span class="unit">CNY</span></td>
                                </tr>
                                <tr>
                                    <td>{:lang("total_volume")}</td>
                                    <td class="text-right">{{sumtg}}<span class="unit">CBM</span></td>
                                    <td>{:lang("total_weight")}</td>
                                    <td class="text-right">{{sumkgs}} <span class="unit">KGS</span></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                	<div class="tab-pane" id="buy_item">
                        <div class="row" v-if="!pro_item.length"><h3 style="text-align: center;">{:lang('no_data')}</h3></div>
                        <table v-if="pro_item.length" class="table table-striped table-hover ntTable">
                            <thead>
                                <tr>
                                    <td>{:lang("purchase")}</td>
                                    <td>{:lang('product_name')}</td>
                                    <td>配给数量</td>
                                    <td width="20%">{:lang("purchase_quantity_")}</td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr v-for="(item,index) in pro_item">
                                    <td class="text-center"><input type="checkbox"  v-model="!pro_item[index].is_public"></td>
                                    <td>
                                    	<small>{{item.id + (item.brand_name ? '/'+item.brand_name : '') + (item.model ? '/'+item.model : '')}}</small><br>
                                        <a href="" target="_blank">{{item.content}}</a>
                                    </td>
                                    <td>{{item.match_ratio}}<span class="unit">PCS/UN</span></td>
                                    <td><input type="number" class="form-control text-right" readonly="readonly" :value="numsum(item.match_ratio,index)"></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                	<div class="tab-pane" id="buy_history">
                        <div class="row" v-if="!history.length"><h3 style="text-align: center;">{:lang('no_data')}</h3></div>
                        <table v-if="history.length" class="table table-striped table-hover ntTable">
                            <thead>
                                <tr>
                                    <td>{:lang("contract")}</td>
                                    <td>{:lang("date")}</td>
                                    <td>{:lang("company")}</td>
                                    <td>{:lang("quantity")}</td>
                                    <td>{:lang('price')}</td>
                                </tr>
                            </thead>
                            <tbody>
                                <tr v-for="(item,index) in history">
                                    <td><a href="" target="_blank">{{item.po_id}}</a></td>
                                    <td>{{item.create_time}}</td>
                                    <td><a :href="'/admin/customer/companycheck?company_id='+item.company_id+'&tab=detail'" target="_blank">{{item.name}}</a></td>
                                    <td>{{item.qty}}<span class='unit'>PCS</span></td>
                                    <td>{{item.price}}<span class='unit'>CNY</span></td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="/static/Admin/js/plan_addnew.js"></script>
{include file="public/foot"/}